

var ScrollPanel = function(panel, inner, opts) {
    var defaultOpts = {
        direction: this.HORIZONTAL,
        displayCount: 1,
        speed: 100,
        // itemSize should be width (direction == HORIZONTAL) 
        // or be height (direction == VERTICAL) 
        itemSize: 0
    };

    this.panel = j$(panel);
    this.opts = defaultOpts;
    for(var k in defaultOpts) {
        if(opts[k] != undefined) {
            this.opts[k] = opts[k];
        }
    }
    this.total = 0;
    this.current = 0;
    this.inner = this.panel.find(inner);
};

ScrollPanel.HORIZONTAL = 0;
ScrollPanel.VERTICAL = 1;


ScrollPanel.prototype.navigator = function(navi, callback) {
    var _this = this;
    var navi = j$(navi);
    var prev = navi.find(".prev") || j$("<a class='prev'></a>").appendTo(navi);
    var next = navi.find(".next") || j$("<a class='next'></a>").appendTo(navi);

    prev.click(function() {
        _this.scrollPrev(callback);
    });
    next.click(function() {
        _this.scrollNext(callback);
    });
    
    this.navi = {
        obj: navi,
        prev: prev,
        next: next
    };
    return this;
};

ScrollPanel.prototype._refreshNavigator = function() {
    if(this.current > 0) {
        this.navi.prev.addClass("active");
    } else {
        this.navi.prev.removeClass("active");
    }

    if(this.current < this.total - this.opts.displayCount) {
        this.navi.next.addClass("active");
    } else {
        this.navi.next.removeClass("active");
    }
};

ScrollPanel.prototype.addItem = function(count) {
    var count = count || 1;
    this.total += count;
    this._refreshNavigator();
};

ScrollPanel.prototype.removeItem = function(count) {
    var count = count || 1;
    this.addItem(-count);
};

ScrollPanel.prototype.scrollTo = function(offset, callback) {
    var _this = this;
    offset = Math.max(0, Math.min(this.total - this.opts.displayCount,
                                  offset));
    if(offset != this.current) {
        this.current = offset;
        if (this.opts.direction == this.HORIZONTAL) {
            this.inner.animate({left: "-" + (this.opts.itemSize * this.current)},
                               this.opts.speed,
                               function() {
                                   _this._refreshNavigator();
                                   if(callback) {
                                       callback();
                                   }
                               });
        } else {
            this.inner.animate({top: "-" + (this.opts.itemSize * this.current)},
                               this.opts.speed,
                               function() {
                                   _this._refreshNavigator();
                                   if(callback) {
                                       callback();
                                   }
                               });
        }
    } else {
        if(callback) {
            callback();
        }
    }
};

ScrollPanel.prototype.scrollPrev = function(callback) {
    this.scrollTo(this.current - 1, callback);
};

ScrollPanel.prototype.scrollNext = function(callback) {
    this.scrollTo(this.current + 1, callback);
};



